<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<div class="full-width margin-all padding-vertical">
	<h1>Order Review</h1>
</div>
<h2 class="font-20">Please review your order before submit</h2>

<h3>Order summary</h3>

<ol class="margin-left padding-left font-16" style="line-height:20px">
	<li class="margin-all border-bottom">
		<span>Sender Information</span>
		<ul class="font-14 serif margin-vertical-half">
			<li>
				<label>Sender Company: </label>
				<span><c:out value="${order.sender.companyName}" escapeXml="false"/></span>
			</li>
			<li>
				<label>Sender Name: </label>
				<span>
					<c:out value="${order.sender.firstName}" escapeXml="false"/>
					<c:out value="${order.sender.lastName}" escapeXml="false"/>
				</span>
			</li>
			<li>
				<label>Sender address: </label>
				<span>
					<c:out value="${order.sender.source.addressLine1}" escapeXml="false"/>
					<c:out value="${order.sender.source.addressLine2}" escapeXml="false"/>,
					<c:out value="${order.sender.source.city}" escapeXml="false"/>,
					<c:out value="${order.sender.source.state}" escapeXml="false"/>
					<c:out value="${order.sender.source.zip}" escapeXml="false"/>
				</span>
			</li>
			<li>
				<label>Sender Phone#:</label>
				<span><c:out value="${order.sender.phoneNumber}" escapeXml="false"/></span>
			</li>
		</ul>
	</li>
	<li class="margin-all border-bottom">
		<span>Recipient Information</span>
		<ul class="font-14 serif margin-vertical-half">
			<li>
				<label>Recipient Company: </label>
				<span><c:out value="${order.recipient.companyName}" escapeXml="false"/></span>
			</li>
			<li>
				<label>Recipient Name: </label>
				<span>
					<c:out value="${order.recipient.firstName}" escapeXml="false"/>
					<c:out value="${order.recipient.lastName}" escapeXml="false"/>
				</span>
			</li>
			<li>
				<label>Recipient address: </label>
				<span>
					<c:out value="${order.recipient.destination.addressLine1}" escapeXml="false"/>
					<c:out value="${order.recipient.destination.addressLine2}" escapeXml="false"/>,
					<c:out value="${order.recipient.destination.city}" escapeXml="false"/>,
					<c:out value="${order.recipient.destination.state}" escapeXml="false"/>
					<c:out value="${order.recipient.destination.zip}" escapeXml="false"/>
				</span>
			</li>
			<li>
				<label>Recipient Phone#:</label>
				<span><c:out value="${order.recipient.phoneNumber}" escapeXml="false"/></span>
			</li>
		</ul>
	</li>
	<li class="margin-all border-bottom">
		<span>Package &amp; Shipment Information</span>
		<ul class="font-14 serif margin-vertical-half">
			<li>
				<label>Shipping Date:</label>
				<span><fmt:formatDate value="${order.shippingDate}" pattern="MM/dd/yyyy"/></span>
			</li>
			<li>
				<label>No. of Package:</label>
				<span><c:out value="${fn:length(order.packages)}" escapeXml="false"/></span>
			</li>
			<c:forEach items="${order.packages}" var="package" varStatus="status">
				<li class="border-top margin-top-half padding-top-half">Package #${status.count}</li>
				<li class="margin-left">
					<label>Weight: </label>
					<span><c:out value="${package.weight}" escapeXml="false"/></span>
					<span> lbs</span>
				</li>
				<li class="margin-left">
					<label>Dimensions: </label>
					<span><c:out value="${package.length}" escapeXml="false"/></span>
					<span class="sans-serif">x</span>
					<span><c:out value="${package.width}" escapeXml="false"/></span>
					<span class="sans-serif">x</span>
					<span><c:out value="${package.height}" escapeXml="false"/></span>
					<span> inches</span>
				</li>
				<c:if test="${package.value gt 0 }">
				<li class="margin-left <c:if test='${status.last}'> padding-bottom-half border-bottom</c:if>" >
					<label>Declared value: </label>
					<span><c:out value="${package.value}" escapeXml="false"/></span>
					<span> USD</span>
				</li>
				</c:if>
			
			</c:forEach>
			<li class="margin-top-half" >
				<label>Service Type: </label>
				<span><c:out value="${order.serviceType}" escapeXml="false"/></span>
			</li>
			<li>
				<label>Preferred Pick-up time:</label>
				<c:forEach items="${order.schedulePickupDateList}" var="pkdate" varStatus="status">
					<c:if test='${pkdate.valid}'> 
						<span><fmt:formatDate value="${pkdate.pickupDateScheduled}" pattern="MM/dd/yyyy h:m"/></span>
					</c:if>
				</c:forEach>
			</li>
	</li>
	<li class="margin-all border-bottom">
		<span>Payment Information</span>
		<ul class="font-14 serif margin-vertical-half">
			<c:forEach items="${order.payments}" var="payment" varStatus="status">
				<li>Credit Card Type: <c:out value="${payment.creditCard.type}"/></li>
  				<c:set var="lenthOfAccountNumber" value="${fn:length(payment.creditCard.accountNumber)}"/>
  				<c:set var="startIdx" value="${lenthOfAccountNumber-4}"/>
  				<c:set var="endIdx" value="${lenthOfAccountNumber}"/>
				<li>Credit Card No.: <c:out value="xxxx-${fn:substring(payment.creditCard.accountNumber,startIdx,endIdx)}"/></li>
				<li>Name on Card: <c:out value="${payment.creditCard.nameAppearedOnCard}"/></li>
				<li class="bold alert">Amount: <fmt:formatNumber type="currency" value="${payment.amount}"/></li>
  			</c:forEach>		
		</ul>
	</li>
</ol>

<div class="margin-all padding-all border-top">
<form action="/dms/order-confirmation.html" name="dms-order-confirmation-form" class="form formalize" method="post">
	<input type="submit" value="submit" />
	<a href="/dms/place-an-order.html">
		<button>Modify</button>
	</a>
</form>
	
</div>